<script lang="ts">
import { defineComponent, watch } from 'vue';
import { ElLoading } from 'element-plus';
export default defineComponent({
	props: {
		msg: Object,
		aaa: Number,
	},
	setup(props) {
		watch(
			() => props.msg,
			(_data) => {
				const loadingInstance = ElLoading.service({
					lock: false,
					text: '加载中……',
					background: 'rgba(0, 0, 0, 0.6)',
				});
				if (!_data.show) {
					loadingInstance.close();
				}
			},
			{
				deep: true,
			}
		);
	},
});
</script>

<style scoped lang="scss">
.loading {
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.2);
	position: fixed;
	top: 0;
	left: 0;
	display: flex;
	justify-content: center;
	align-items: center;
	div {
		background-color: rgba(0, 0, 0, 0.8);
		color: #fff;
		padding: 6px 15px;
	}
}
</style>
